<!DOCTYPE html>
<html lang="en" >
<head xmlns:th="http://www.thymtleaf.org">
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <link rel="stylesheet" href="/plugins/bootstraptable/bootstrap-table.min.css">

    <script src="/js/jquery-3.7.1.min.js"></script>


</head>
<body>
<!-- 整个显示界面 -->
<div class="container-fluid" style="text-align: center;">
    <!-- 切换按钮 -->
    <br>
    <div style="text-align: left">
        页面切换：
        <button type="button" class="btn btn-primary" onclick="window.location.href = '/teacher/tlist'">教师表</button>
        <button type="button" class="btn btn-primary" onclick="window.location.href = '/course/clist'">课程表</button>
        <button type="button" class="btn btn-primary" onclick="window.location.href = 'http://localhost:8080/login/user'">登录页面</button>
    </div>
    <!-- 标题 -->
    <hr style="margin-bottom: -3px">
    <h1 style="font-family: 华文宋体">学<nobr>&nbsp&nbsp</nobr>生<nobr>&nbsp&nbsp</nobr>表</h1>
    <hr style="margin-bottom: -3px">
    <!-- 按钮 -->
    <table style="margin: 20px auto; width: 100%">
        <tr style="margin-bottom: 10px">
            <td width="90px">
                <!-- 查询选项 -->
                <select class="form-control" id="option" name="option">
                    <option value="sname">姓名</option>
                    <option value="sno">学号</option>
                </select>
            </td>
            <td style="text-align:left;">
                <!-- 查询按钮 -->
                <form class="form-inline">
                    <div class="form-group">
                        <label for="searchName"></label>
                        <input type="text" class="form-control" id="searchName" name="searchName" placeholder="请输入查询内容">
                    </div>
                    <button type="button" class="btn btn-primary" onclick="searchStudentName();">查询</button>
                </form>
            </td>
            <td style="text-align:right;">
                <!-- 新增按钮 -->
                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal" onclick="preAdd();">新增学生</button>
            </td>
        </tr>
    </table>
    <!-- 学生表 -->
    <table id="stuTable" class="table table-striped" style="margin: 0 auto; padding: 20px;"></table>
</div>


<div class="modal fade" tabindex="-1" role="dialog" id="myModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">学生信息</h4>
            </div>
            <div class="modal-body">

                <form id="formStudent">
                    <input hidden="hidden" id="sid" name="id"/>
                    <div class="form-group">
                        <label for="sname">姓名</label>
                        <input type="text" class="form-control" id="sname" name="sname" placeholder="请输入姓名" required minlength="2" maxlength="20">
                        <label id="name-error" class="error" for="spassword" style="color: red">姓名是必填项！</label>
                    </div>
                    <div class="form-group">
                        <label for="sno">学号</label>
                        <input type="text" class="form-control" id="sno" name="sno" placeholder="请输入学号" required minlength="10" maxlength="10">
                        <label id="number-error" class="error" for="spassword" style="color: red">学号是必填项！</label>
                    </div>
                    <div class="form-group">
                        <label for="spassword">密码</label>
                        <input type="password" class="form-control" id="spassword" name="spassword" placeholder="请输入密码" required minlength="6" maxlength="15">
                        <label id="password-error" class="error" for="spassword" style="color: red">密码是必填项！</label>
                    </div>
                    <div class="form-group">
                        <label for="ssex">性别：</label>
                        <select class="form-control" id="ssex" name="ssex">
                            <option value="1">男</option>
                            <option value="2">女</option>
                        </select>
                    </div>

                    <div class="form-group">
                        <label for="sage">年龄</label>
                        <input type="text" class="form-control" id="sage" name="sage" placeholder="请输入年龄" required min="16" max="30">
                        <label id="age-error" class="error" for="spassword" style="color: red">年龄是必填项！</label>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary" onclick="saveStudent();">保存</button>
                    </div>
                </form>
                <!--表单结束-->

            </div>

        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->




<script src="/js/bootstrap.min.js"></script>
<script src="/plugins/bootstraptable/bootstrap-table.min.js"></script>
<script src="/plugins/bootstraptable/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="/plugins/jqvalidate/jquery.validate.min.js"></script>
<script src="/plugins/jqvalidate/localization/messages_zh.min.js"></script>
<script src="/pagejs/studentlist.js"></script>


</body>
</html>
